import { type RouteDefinition, Router } from "@solidjs/router";
import { lazy } from "solid-js";

import RootLayout from "@/layouts/RootLayout";

const routes: RouteDefinition[] = [
  {
    path: "/",
    component: lazy(() => import("@/routes/home")),
  },
  {
    path: "/audio/recorder",
    component: lazy(() => import("@/routes/audio/recorder")),
  },
  {
    path: "/components",
    component: lazy(() => import("@/routes/components")),
  },
  {
    path: "/demo",
    children: [
      {
        path: "/",
        component: lazy(() => import("@/routes/demo")),
      },
      {
        path: "/dom",
        component: lazy(() => import("@/routes/demo/dom")),
      },
      {
        path: "/error",
        component: lazy(() => import("@/routes/demo/error")),
      },
      {
        path: "/joke",
        component: lazy(() => import("@/routes/demo/joke")),
      },
      {
        path: "/load-data",
        component: lazy(() => import("@/routes/demo/load-data")),
      },
    ],
  },
  {
    path: "/login",
    component: lazy(() => import("@/routes/login")),
  },
  {
    path: "*",
    component: lazy(() => import("@/routes/_404")),
  },
];

export default function Routes() {
  return <Router root={RootLayout}>{routes}</Router>;
}
